<template>
	<div>
		<van-uploader
			:max-count="1"
			v-model="fileList"
			:after-read="afterRead"/>
		<van-cell-group>
			<van-field 
				lable="文章标题" 
				placeholder="文章标题"
				v-model="title"/>
			<van-field
				lable="文章简介" 
				placeholder="文章简介"
				v-model="summary"/>
			<van-field
				lable="文章内容" 
				placeholder="文章内容"
				v-model="content"
				type="textarea"
				autosize/>
			<van-button 
				type="primary"
				@click="handelAdd"
				class="add-button">提交</van-button>
		</van-cell-group>
	</div>
</template>

<script>
	export default {
		data(){
			return{
				fileList: [],
				title: '',
				summary: '',
				content: '',
				img: ''
			}
		},
		methods:{
			afterRead(info){
				console.log(info)
				this.img = info.content
			},
			handelAdd(){
				const data = {
					img: "img3.mukewang.com/szimg/5e6b4ede09bc3b4412000676-360-202.png"|| this.img ,
					title: this.title,
					summary: this.summary,
					content: this.content
				}
				fetch('/article/create', {
					method: 'post',
					headers: {
						'Content-type': 'application/json'
					},
					body: JSON.stringify(data)
				})
				.then(res=>res.json())
				.then(res=>{
					if(res.status == 200){
						this.$toast.fail('文章发布成功')
						this.$router.push('/')
					}else{
						this.$toast.fail(res.errMsg)
					}
				})
			}
		}
	}
</script>

<style scoped>
	.add-button{
		position: fixed;
		left: 0;
		bottom: 50px;
		width: 100%;
	}
</style>

